<template>
  <!-- 基于 Element UI 新增和修改弹窗 -->
    <a-drawer
            :title="!dataForm.id ? '添加' : '修改'"
            :visible="visible"
            @close="cancel"
            :body-style="{ paddingBottom: '80px' }"
            :width="750"
    >
    <!-- 新增和创建表单表单 -->
    <el-form :model="dataForm" :rules="dataRule"  v-loading="loading" ref="dataForm" @keyup.enter.native="dataSubmit()" label-width="80px" style="padding: 0px 10px;margin: 0px 10px">
  <el-form-item label="广告类型" >
      <el-input v-model="dataForm.adtype" placeholder="请输入广告类型" size="small"></el-input>  </el-form-item>
  <el-form-item label="广告平台" >
      <el-input v-model="dataForm.adplatform" placeholder="请输入广告平台" size="small"></el-input>  </el-form-item>
  <el-form-item label="ecpm值：分" >
      <el-input v-model="dataForm.ecpm" placeholder="请输入ecpm值：分" size="small"></el-input>  </el-form-item>
  <el-form-item label="ecpm金币比例" >
      <el-input v-model="dataForm.ecpmrate" placeholder="请输入ecpm金币比例" size="small"></el-input>  </el-form-item>
  <el-form-item label="上级抽取比例" >
      <el-input v-model="dataForm.extractionrate" placeholder="请输入上级抽取比例" size="small"></el-input>  </el-form-item>
  <el-form-item label="用户层级" >
      <el-input v-model="dataForm.level" placeholder="请输入用户层级" size="small"></el-input>  </el-form-item>
  <el-form-item label="金币数量" >
      <el-input v-model="dataForm.coin" placeholder="请输入金币数量" size="small"></el-input>  </el-form-item>
  <el-form-item label="广告id" >
      <el-input v-model="dataForm.adsysid" placeholder="请输入广告id" size="small"></el-input>  </el-form-item>
  <el-form-item label="任务ID" >
      <el-input v-model="dataForm.taskid" placeholder="请输入任务ID" size="small"></el-input>  </el-form-item>
  <el-form-item label="任务名称" >
      <el-input v-model="dataForm.taskname" placeholder="请输入任务名称" size="small"></el-input>  </el-form-item>
  <el-form-item label="用户ID" >
      <el-input v-model="dataForm.userid" placeholder="请输入用户ID" size="small"></el-input>  </el-form-item>
  <el-form-item label="用户名称" >
      <el-input v-model="dataForm.username" placeholder="请输入用户名称" size="small"></el-input>  </el-form-item>
  <el-form-item label="设备收益根userid" >
      <el-input v-model="dataForm.ruserid" placeholder="请输入设备收益根userid" size="small"></el-input>  </el-form-item>
  <el-form-item label="设备收益根id，rid==0，为总计" >
      <el-input v-model="dataForm.rid" placeholder="请输入设备收益根id，rid==0，为总计" size="small"></el-input>  </el-form-item>
  <el-form-item label="设备ID" >
      <el-input v-model="dataForm.deviceid" placeholder="请输入设备ID" size="small"></el-input>  </el-form-item>
  <el-form-item label="机构ID" >
      <el-input v-model="dataForm.orgid" placeholder="请输入机构ID" size="small"></el-input>  </el-form-item>
  <el-form-item label="真实金币" >
      <el-input v-model="dataForm.realcoin" placeholder="请输入真实金币" size="small"></el-input>  </el-form-item>
  <el-form-item label="抽成金币" >
      <el-input v-model="dataForm.sharecoin" placeholder="请输入抽成金币" size="small"></el-input>  </el-form-item>
    </el-form>
        <div :style="{position: 'absolute',right: 0,bottom: 0,width: '100%', borderTop: '1px solid #e9e9e9',padding: '10px 16px',background: '#fff',textAlign: 'right',zIndex: 1,}">
            <el-button @click="cancel()" :style="{ marginRight: '8px' }">取消</el-button>
            <el-button type="primary" @click="submit()">确定</el-button>
        </div>
  </a-drawer>
</template>

<script>
    import api from '@/api/api'
    export default {
    components: {
    },
    data () {
      return {
        visible: false,
        selOptions: {},
        loading:false,
        dataForm: {
          id: 0,
          adtype: '' ,
          adplatform: '' ,
          ecpm: '' ,
          ecpmrate: '' ,
          extractionrate: '' ,
          level: '' ,
          coin: '' ,
          adsysid: '' ,
          taskid: '' ,
          taskname: '' ,
          userid: '' ,
          username: '' ,
          ruserid: '' ,
          rid: '' ,
          deviceid: '' ,
          orgid: '' ,
          createtime: '' ,
          updatetime: '' ,
          realcoin: '' ,
          sharecoin: ''
        },
        dataRule: {
          adtype: [
            { required: true, message: '广告类型  为必填项', trigger: 'blur' }
          ],
          adplatform: [
            { required: true, message: '广告平台  为必填项', trigger: 'blur' }
          ],
          ecpm: [
            { required: true, message: 'ecpm值：分  为必填项', trigger: 'blur' }
          ],
          ecpmrate: [
            { required: true, message: 'ecpm金币比例  为必填项', trigger: 'blur' }
          ],
          extractionrate: [
            { required: true, message: '上级抽取比例  为必填项', trigger: 'blur' }
          ],
          level: [
            { required: true, message: '用户层级  为必填项', trigger: 'blur' }
          ],
          coin: [
            { required: true, message: '金币数量  为必填项', trigger: 'blur' }
          ],
          adsysid: [
            { required: true, message: '广告id  为必填项', trigger: 'blur' }
          ],
          taskid: [
            { required: true, message: '任务ID  为必填项', trigger: 'blur' }
          ],
          taskname: [
            { required: true, message: '任务名称  为必填项', trigger: 'blur' }
          ],
          userid: [
            { required: true, message: '用户ID  为必填项', trigger: 'blur' }
          ],
          username: [
            { required: true, message: '用户名称  为必填项', trigger: 'blur' }
          ],
          ruserid: [
            { required: true, message: '设备收益根userid  为必填项', trigger: 'blur' }
          ],
          rid: [
            { required: true, message: '设备收益根id，rid==0，为总计  为必填项', trigger: 'blur' }
          ],
          deviceid: [
            { required: true, message: '设备ID  为必填项', trigger: 'blur' }
          ],
          orgid: [
            { required: true, message: '机构ID  为必填项', trigger: 'blur' }
          ],
          createtime: [
            { required: true, message: '创建时间  为必填项', trigger: 'blur' }
          ],
          updatetime: [
            { required: true, message: '更新时间  为必填项', trigger: 'blur' }
          ],
          realcoin: [
            { required: true, message: '真实金币  为必填项', trigger: 'blur' }
          ],
          sharecoin: [
            { required: true, message: '抽成金币  为必填项', trigger: 'blur' }
          ]
        }
      }
    },
    methods: {
      init (id) { // 初始化表单验证规则
        this.dataForm.id = id || undefined
        this.visible = true
        this.selOptions=this.$constants.selOptions;
        this.$nextTick(() => {
          this.$refs['dataForm'].resetFields()
          if (this.dataForm.id){
              this.loading = true
                api.post('rest/vabc/deviceadincome/info',{id:this.dataForm.id}).then(res => {
                this.dataForm = res;
            }).finally(() => {
                this.loading = false
            });
          }
        })
      },
      // 表单数据提交
      submit () {
        this.$refs['dataForm'].validate((valid) => {
          if (valid) {
            this.loading = true
            let postData=Object.assign({},this.dataForm)
            if (!this.dataForm.id){
                postData.id==undefined
                api.post('rest/vabc/deviceadincome/save',postData).then(res =>{
                    this.$message.success("创建成功")
                    this.reset()
                    this.visible = false
                    this.$parent.getDataList()
                }).finally(() => {
                    this.loading = false
                });
            }else{
                api.post('rest/vabc/deviceadincome/update',postData).then(res =>{
                    this.$message.success("保存成功")
                    this.reset()
                    this.visible = false
                    this.$parent.getDataList()
                }).finally(() => {
                    this.loading = false
                });
            }
          }
        })
      },
     cancel(){
        this.visible = false
        this.reset()
    },
    reset(){
        this.$refs.dataForm.resetFields()
        this.$data.dataForm=JSON.parse(JSON.stringify(this.$options.data().dataForm))
        //图片回写
        //this.$refs["childData"].fileList=[]
    }
    }
  }
</script>
